var Menu = {
    depths : new Array,
	lastNew : 0,
    
    setDepth : function(mid, miid, num){
        var tds = $("#menuTable-" + mid + " .MI-" + miid).find("td");
        var value = parseInt($(tds[0]).text());
        if(num == -1 && value == 0){
            return false;
        }else{
            $(tds[0]).text(value + num);
            Menu.updateDepthState(miid);
            return true;
        }
    },

    updateDepthState : function(miid){
        var correction = 5;
        
        if(miid!=0){
            var td = $(".menuTable .MI-" + miid + " .depth");
            value = parseInt(td.text()) * 20;
            td.next().css("padding-left", correction + value + "px");
			
        }else{
            var value = 0;
            $(".menuTable").each(function(){
                $(this).find(".depth").each(function(){
                    value = parseInt($(this).text()) * 20;
                    $(this).next().css("padding-left", correction + value + "px");
                });    
            });
        }
    },


    getDepths : function(form){
        var send = "";
        var i=0;
        while (i >= 0) {
            if(!form[i]){
                break;
            }
            if($(form[i]).hasClass("menuDepth")){
                send += form[i].name + "=" + form[i].value + "&";
            }
            i++;
        }
        return send;
    },
    
    edit : function(mi){
        var tr = $(".MI-" + mi);
        var tds = $(tr).find("td");
        
        if($(tr).hasClass("changed") == false){
            $(tr).addClass("changed");            
        }
        
        if($(tr).hasClass("editing") == false){
            $(tds[1]).html("<input type=\"text\" name=\"name\" style=\"width:90%\" value=\"" + $(tds[1]).text() + "\" />");
            $(tds[2]).html("<input type=\"text\" name=\"link\" style=\"width:90%\" value=\"" + $(tds[2]).text() + "\" />");
            $(tr).addClass("editing");
        }else{
            $(tds[1]).html($(tds[1]).find("input").attr("value"));
            $(tds[2]).html($(tds[2]).find("input").attr("value"));
            $(tr).removeClass("editing");
        }
    },
    
	deleteMenu: function(mid){
		$("#menuAdmin-" + mid).hide("fast", function(){ $(this).remove()});
		Cyfy.ajax("Menu", "delete", "", "mid=" + mid);
	}, 
		
	addItem : function(mid){
		var miid = "NEW-" + Menu.lastNew++;
        $("#menuTable-" + mid + " .items").append("\
		<tr class=\"MI-" + miid + " editing changed\">\
            <td class=\"depth\">0</td>\
            <td class=\"name\"><input type=\"text\" name=\"name\" style=\"width:90%\" value=\"\" /></td>\
            <td class=\"link\"><input type=\"text\" name=\"link\" style=\"width:90%\" value=\"\" /></td>\
            <td class=\"action\">\
                <input value=\"&lt;\" onclick=\"Menu.setDepth("+mid+", '" + miid + "', -1);\" type=\"submit\">\
                <input value=\"&gt;\" onclick=\"Menu.setDepth("+mid+", '" + miid + "', 1)\" type=\"submit\"> &nbsp; &nbsp;\
                <input value=\"E\" onclick=\"Menu.edit('" + miid + "');\" type=\"submit\">\
                <input value=\"X\" class=\"button-warning\"  onclick=\"Menu.del('" + miid + "');\" type=\"submit\">\
            </td\>\
        </tr>");
    },
	
    del : function(mi){
        var tr = $(".MI-" + mi);
        if($(tr).hasClass("delete") == false){
            $(tr).addClass("delete");
        }else{
            $(tr).removeClass("delete");
        }
    },
    
    refresh : function(){
        Menu.updateDepthState(0);    
        
        $(".menuTable tbody.items").each(function(){
            $(this).sortable({
                placeholder: 'menuPlaceholder',
                axis: 'y',
                cursor: 'move',
                change: function(e, ui) {
                    Menu.forceHelper(e,ui);
                }

            });
        });
        
        
        
    },
    
    forceHelper : function(e, ui){
        $(".menuPlaceholder").html("<td colspan='100%'>&nbsp;</td>");
    },
    
    submit : function(mid, code){
        
        $table = $("#menuTable-" + mid + " tbody.items");
        var weight = 0;
        var send = "mid=" + mid + "&";
        
        // cycle
        $table.find("tr").each(function()
        {
            var mi = this.className.split(" ")[0].substr(3);
            var tds = this.getElementsByTagName("td");
            send += "mis[]=" + mi + "&";
             // delete?
            if ($(this).hasClass("delete"))
            {
                send += "delete[" + mi + "]=1&";
            }
            else
            {
                // weight
                weight++;
                send += "weights[" + mi + "]=" + weight + "&";            
                // depth
                var depth = tds[0].textContent;
                send += "depths[" + mi + "]=" + depth + "&";            
                // changed?
                if($(this).hasClass("changed")){
                    if($(this).hasClass("editing") == true){
                        Menu.edit(mi);
                    }
					if(tds[1].textContent && tds[2].textContent)
					{
						var name = tds[1].textContent.replace("&", "%26").replace("#","%23").replace(";","%3B");
						var link = tds[2].textContent.replace("&", "%26").replace("#","%23").replace(";","%3B");
						send += "names[" + mi + "]=" + Url.encode(name) + "&links[" + mi + "]=" + link + "&";
					}
                }
            }            
           
        });
        
        Cyfy.ajax("Menu", "save", "#menuTableDiv-" + mid, send, "Menu.refresh(); Blocks.reload('Menu', '" + code + "', '');");
    }
}



$(document).ready(function(){
    Menu.refresh();
    // Note that I took the event string to bind to out of the jQuery.ui.js file.
});


